<!-- 试复样登记 -->
<template>
    <div class="my-tool-bar" style="padding:0px 10px 10px 0px;box-sizing: border-box;">
        <Toolbar :items="['查询', '新增']" @select="selectHandler" @add="addHandler" />
    </div>
    <div ref="tablediv" style="padding: 10px; box-sizing: border-box;height:100%">
          <AgGridVuesCopys :rowHeight="33" :headerHeight="33" :suppressCopyRowsToClipboard="true" rowSelection="multiple" @grid-ready="gridReady" style="height:85%" class='ag-theme-alpine'
            :defaultColDef="defaultColDef" :rowData="table.dataList" :columnDefs="cfsValue" :localeText="localeTextData" />
        <paginationCopys :total="total" show-total show-jumper show-page-size @change="changePage"
            @page-size-change="changeSize" style="justify-content: center;margin-top: 10px;"
            :page-size="pagination.pageSize" :current="pagination.page" />
    </div>
    <a-drawer :drawer-style="{ zIndex: 999 }" height="100%" unmountOnClose :visible="pageData.showAdd"
        :mask-closable="false" placement="bottom" @cancel="pageData.showAdd = false">
        <template #title>
            {{ pageData.sideTitle }}
        </template>
        <dup-summary ref="dupSummary" :dataForm="dataForm" /> 
        <template #footer>
            <a-button size="mini" @click="pageData.showAdd = false">
                关闭
            </a-button>
            <a-button type="primary" size="mini" @click="saveHandler">
                保存
            </a-button>
        </template>
    </a-drawer>
   
</template> 
<script lang="ts">
import { dupSummary } from '@/api/laboratory';
import { Message } from '@arco-design/web-vue';
import { reactive, ref, unref, onMounted } from 'vue';

import { localeText } from '@/api/aggridZw'
import emitter from '@/hooks/useEventBus'
import { usePagination, useTable } from '@/hooks/table';
export default {
    name: 'testDupSummaryList',
    components: {  },
    methods: {
        async saveHandler() {
            let data = null, res: any = {};
            data = unref(this.$refs.dupSummary.dataForm);
            if (!data.id) {
                res = await dupSummary().addDupSummary({ ...data });
            } else {
                res = await dupSummary().editDupSummary({ ...data });
            }
            if (res.code === 200) {
                this.pageData.showAdd = false;
                Message.success('操作成功');
                this.doRefresh();
            } else {
                Message.error(res.message);
            }
        },

    },
    setup() {
        const dupSummaryApi = dupSummary();
        const table = useTable();
        onMounted(() => {
            // 第一个页面需要在刚进入就调用一次  切换tap时也需要调用
            selectHandler();
            emitter.on("refresh-testDupSummaryList", () => {
                selectHandler();
            });
        });

        const doRefresh = async () => {
            pageData.pageLoading = true;
            await dupSummaryApi.getPageDupSummaryList({
                page: pagination.page,
                size: pagination.pageSize
            }).then(({ code, data }: any) => {
                if (code === 200) {
                    table.handleSuccess(data.list);
                    gridOption.value.setRowData(data.list);
                    total.value = data.total;
                } else {
                    Message.error({
                        content: "查询失败",
                        duration: 5000,
                    });
                }
                // console.log(res);
            }).catch(console.log).finally(() => {
                pageData.pageLoading = false;
            });
        };
        const selectHandler = () => {
            pagination.page = 1;
            doRefresh();
        };
        const dataForm: any = ref({});
        const pageData = reactive<{
            showAdd: boolean,
            sideTitle: string,
            pageLoading: boolean,
           
        }>({
            showAdd: false,
            sideTitle: '',
            pageLoading: false,
        });
        const addHandler = () => {
            pageData.showAdd = true;
            dataForm.value = {};
            pageData.sideTitle = '新增明细列表';
        };
        const editHandler = (record: any) => {
            pageData.showAdd = true;
            pageData.sideTitle = '编辑明细列表';
            for (var key in record) {
                dataForm.value[key] = record[key]
            };
        }
        //汇总列表
        const gridOption = ref();
        const gridReady = (params: any) => {
            gridOption.value = params.api;
            //调整表格自适应大小
            // gridOption.value.sizeColumnsToFit(); 
        };
        const defaultColDef = {
            sortable: true,
            resizable: true,
            filter: true,
            // flex: 1,
            width: 150,
        }
        const cfsValue = [
            {
                headerName: '生产车间',
                field: 'worksho',
                width: 150,
            },
            {
                headerName: '复T中',
                field: 'repeatedTIn',
                width: 150,
            },
            {
                headerName: '复TOK',
                field: 'repeatedTOk',
                width: 150,
            },
            {
                headerName: '套绵中',
                field: 'harnessIn',
                width: 150,
            },
            {
                headerName: '套绵OK',
                field: 'harnessOk',
                width: 150,
            },
            {
                headerName: '复办中',
                field: 'handleIn',
                width: 150,
            },
            {
                headerName: '复办OK',
                field: 'handleOk',
                width: 150,
            },
            {
                headerName: '加色中',
                field: 'colourIn',
                width: 150,
            },
            {
                headerName: '加色OK',
                field: 'colourOk',
                width: 150,
            },
            {
                headerName: '放样中',
                field: 'releaseIn',
                width: 150,
            },
            {
                headerName: '放样OK',
                field: 'releaseOk',
                width: 150,
            },
            {
                headerName: '待刷毛磨毛',
                field: 'brushingIn',
                width: 150,
            },
            {
                headerName: '刷毛磨毛OK',
                field: 'brushingOk',
                width: 150,
            },
            {
                headerName: '烧毛中',
                field: 'singeingIn',
                width: 150,
            },
            {
                headerName: '烧毛OK',
                field: 'singeingOK',
                width: 150,
            },
            {
                headerName: '复方中',
                field: 'compoundIn',
                width: 150,
            },
            {
                headerName: '复方OK',
                field: 'compoundOK',
                width: 150,
            },
            {
                headerName: '定坯OK',
                field: 'decideBaseOk',
                width: 150,
            },
            {
                headerName: '待长车煮布',
                field: 'vehicle',
                width: 150,
            },
            {
                headerName: '煮布OK',
                field: 'vehicleOk',
                width: 150,
            },
            {
                headerName: 'OK',
                field: 'ok',
                width: 150,
            },
            {
                headerName: '备注',
                field: 'remark',
                width: 150,
            },
            {
                headerName: '建立人',
                field: 'createName',
                width: 150,
            },
            {
                headerName: '建立时间',
                field: 'createTime',
                width: 170,
            },
            {
                headerName: '修改人',
                field: 'updateName',
                width: 150,
            },
            {
                headerName: '修改时间',
                field: 'updateTime',
                width: 170,
            },
            {
                headerName: '操作',
                field: 'action',
                resizable: false,
                filter: false,
                sortable: false,
                lockPosition: 'right',
                width: '100',
                pinned: 'right',
                cellRenderer: {
                    template: `<a-tag color="#ff7d00" @click="a" class="gesture">修改</a-tag>`,
                    setup(props: any) {
                        const a = () => {
                            editHandler(props.params.data)
                        }
                        return {
                            a
                        }
                    }
                },
            },
        ]
        const total = ref(10);
        const changePage = (val: any) => {
            pagination.page = val
            doRefresh();
        }
        const changeSize = (val: any) => {
            pagination.pageSize = val
            doRefresh();
        }
        const pagination = usePagination(doRefresh);
        const localeTextData: any = ref(localeText);
    
        return {
            doRefresh,
            dataForm,
            pageData,
            cfsValue,
            gridOption,
            gridReady,
            defaultColDef,
            total,
            changePage,
            changeSize,
            localeTextData,
            table,
            selectHandler,
            addHandler,
            pagination,
        }
    }
}
</script>
<style lang="less" scoped>

</style>